import classNames from "classnames";
import { useState } from "react";
import "./index.scss";

function GoodsCommentImage({ pictures }: { pictures: any[] }) {
  const [currImage, setCurrentImage] = useState<any>("");
  return (
    <div className="goods-comment-image">
      <div className="list">
        {pictures.map((item: any) => (
          <a
            href="javascript:;"
            onClick={() => setCurrentImage(item)}
            className={classNames({ active: currImage === item })}
          >
            <img src={item} alt="" />
          </a>
        ))}
      </div>
      {currImage && (
        <div className="preview">
          <img src={currImage} alt="" />
          <i
            onClick={() => setCurrentImage("")}
            className="iconfont icon-close-new"
          ></i>
        </div>
      )}
    </div>
  );
}
export default GoodsCommentImage;
